<template>
  <div>
    <section class="add-btn">
      <el-button type="primary" @click="edit('add')" v-if=" !noShow ">新增</el-button>
    </section>
    <el-table
      size="mini"
      v-loading="loading"
      :data="tableData"
      style="width: 100%;"
      border
      :header-cell-style="{
        'background-color': '#eeeeee !important',
      }"
      :row-class-name="tableRowClassName"
    >
      <el-table-column type="index" label="序号" width="60" align="center">
        <template slot-scope="scope">
          <span>{{
            (page.pageNo - 1) * page.pageSize + scope.$index + 1
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="调整时间"
        prop="createDate"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        label="调整方式"
        :show-overflow-tooltip="true">
        <template slot-scope="scope">
          {{$dictUtils.getDictLabel("adjustType", scope.row.adjustType, "")}}
        </template>
      </el-table-column>
      <el-table-column
        label="调整数量"
        prop="quantity"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        prop="createBy.loginName"
        label="操作人"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column
        prop="createDate"
        label="操作时间"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column prop="state" label="状态"  width="90px" align="center">
        <template slot-scope="scope">
          <el-switch
            v-model="scope.row.state"
            :inactive-value="0"
            :active-value="1"
            @change="editState($event, scope.row)"
          >
          </el-switch>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="操作" width="112px" v-if="!noShow">
        <template slot-scope="scope">
            <el-link v-if="scope.row.state===1" type="primary" :underline="false" :disabled="true">修改</el-link>
          <el-link
            v-if="scope.row.state!=1"
            type="primary"
            :underline="false"
            @click="edit('edit',scope.row)"
          >修改</el-link
          >
            <el-link
                type="primary"
                v-if="scope.row.state===1"
                :underline="false"
                :disabled="true"
            >删除</el-link
            >
          <el-link
            type="primary"
            v-if="scope.row.state!=1"
            :underline="false"
            @click="del(scope.row.id)"
          >删除</el-link
          >
        </template>
      </el-table-column>
    </el-table>
    <el-pagination
      background
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :page-size="page.pageSize"
      :current-page="page.pageNo"
      layout="total,prev, pager,next"
      :total="page.total"
    >
    </el-pagination>
    <el-dialog
      :title="title"
      class="addForm-wrapper"
      :visible.sync="innerVisible"
      :close-on-click-modal="false"
      append-to-body>

      <el-form
        label-width="93px"
        ref="form"
        :model="editForm"
      >
        <!-- oninput="value=value.replace(/[^\d]/g,'')" -->
        <el-form-item label="调整方式:" prop="adjustType"
                      :rules="[
                  {required: true, message:'请选择调整方式', trigger:'blur'}
                 ]">
          <el-select clearable v-model="editForm.adjustType">
            <el-option
              v-for="item in  $dictUtils.getDictList('adjustType')"
              :key="item.value"
              :label="item.label"
              :value="Number(item.value)">
            </el-option>
          </el-select>

        </el-form-item>
        <el-form-item label="调整数量:" prop='quantity' :rules="[
                  {required: true, message:'请输入调整数量', trigger:'blur'},
                  {validator: validator.isFloat, trigger:'blur'}
                 ]"  >
          <el-input class="adjustInputAppend appendLess" v-model="editForm.quantity">
            <span slot="suffix">吨</span>
          </el-input>
        </el-form-item>
        <el-form-item label="调整原因:" prop="remark" :rules="[
                  {required: true, message:'请输入调整原因', trigger:'blur'},
                 ]">
          <el-input
            type="textarea"
            :rows="2"
            v-model="editForm.remark"
            placeholder="请输入内容">
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="small" type="primary" @click="doSubmit()" v-noMoreClick
        >确定</el-button
        >
        <el-button size="small" @click="close()">取消</el-button>
      </span>
    </el-dialog>
  </div>

</template>
<script>
  import {getAdjustList, saveBusinessAdjust, deleteAdjust, getAdjustInfo} from '@/api/business/business.js'

export default {
  components: {
  },
  data () {
    return {
      noShow:false,
      innerVisible: false,
      loading: false,
      title: '数量调整',
      businessId: '',
      page: {
        pageSize: 10,
        pageNo: 1,
        total: 0
      },
      tableData: [],
      editForm: {
        businessId: '',
        adjustType: '',
          remark: '',
        quantity: ''
      }
    }
  },
  methods: {
    edit (method, editForm) {
      if (method === 'add') {
        this.editForm = {}
        this.innerVisible = true
      } else if (method === 'edit') {
        getAdjustInfo({id: editForm.id}).then((res) => {
          if (res.data.code === '200') {
            this.innerVisible = true
            this.$nextTick(() => {
              this.editForm = {}
              this.editForm.id = res.data.result.id
              this.editForm.remark = res.data.result.remark
              this.editForm.businessId = res.data.result.businessId
              this.editForm.adjustType = res.data.result.adjustType
              this.editForm.quantity = res.data.result.quantity
            })
            this.title = '调量设置'
          } else {
            this.$message({
              type: 'error',
              message: res.data.message
            })
          }
        })
      }
    },
    // 获取调量列表
    getList (businessId) {
      this.businessId = businessId
      this.loading = true
      getAdjustList({
        businessId: businessId,
        pageSize: this.page.pageSize,
        pageNo: this.page.pageNo
      }).then((res) => {
        if (res.data.code === '200') {
          this.tableData = res.data.result.list;
          this.page.total = res.data.result.count
        }
        this.loading = false
      })
    },
    // 删除调量
    del (id) {
      this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then((res) => {
        deleteAdjust({id: id}).then((res) => {
          if (res.data.code === '200') {
            this.$message({
              type: 'success',
              message: '删除成功!'
            })
            this.getList(this.businessId)
          }
        })
      })
    },
    // 新增调量
    doSubmit () {
      if (this.businessId) {
          this.$refs.form.validate((valid) => {
            if (valid) {
              this.$set(this.editForm, 'businessId', this.businessId)
              saveBusinessAdjust(this.editForm).then((res) => {
                if (res.data.code === '200') {
                  this.$message({
                    message: '编辑成功',
                    type: 'success'
                  })
                this.innerVisible = false
                  this.$emit('refreshDataList')
                  this.getList(this.businessId)
                } else {
                  this.$message({
                    message: res.data.message,
                    type: 'error'
                  })
                }
              })
            }
          })
      } else {
        this.$notify.error({
          title: '错误',
          message: '请选择单条业务数据'
        })
      }
    },
    tableRowClassName ({ row, rowIndex }) {
      if (rowIndex % 2 === 1) {
        return 'warning-row'
      } else {
        return 'success-row'
      }
    },
    close () {
      this.innerVisible = false
    },
    handleSizeChange (e) {
      this.page.pageSize = e
      this.getList(this.businessId, this.modelId)
    },
    handleCurrentChange (e) {
      this.page.pageNo = e
      this.getList(this.businessId, this.modelId)
    }
  },

  mounted () {

  }
}
</script>
<style lang="scss">

</style>
